<template>
	<!-- 星球卡片 -->
	<uni-col :xs="12" :sm="6" :md="4" :lg="4" :xl="1" class="col">
		<!-- 我的星球图片 -->
		<view class="card">
			<image src="/static/img/plant.jpg" mode="heightFix" class="myPlant_img">
			</image>
			<view style="display: flex;flex-direction: column;height: 30%;width: 100%;">
				<view style="height: 30%;">
					<text class="myPlant_text"
						style="font-size: 35rpx;font-weight: 300;margin:3% 0% 2% 3%;">{{item.name}}</text>
				</view>
				<view style="height: 70%;display: flex;">
					<text class="myPlant_text"
						style="font-size: 5rpx;font-weight: 100;width: 70%;margin: 7% 0 0 7%;">作者名字</text>
					<view class="avater_view">
						<image mode="widthFix" src="/static/img/plant.jpg"
							class="avater">
						</image>
					</view>
				</view>
			</view>
		</view>
	</uni-col>
</template>

<script>
	export default{
		name:"plant-card"
	}
</script>

<style>
	.card {
		height: 400rpx;
		border-radius: 5px;
		background: linear-gradient(to right, #e1e1e1, #c7c7c7);
		width: 80%;
		margin-left: 10%;
		overflow: hidden;
	}
	
	.myPlant_img {
		height: 70%;
	}
	
	.avater_view {
		width: 50rpx;
		height: 50rpx;
		border-radius: 50%;
		background-color: aqua;
		margin-top: 3%;
		overflow: hidden;
	}
	
	/* 头像 */
	.avater {
		width: 70rpx;
	}
</style>